我們先來看看一個例子!
在這裡我們先用props把外層元件的data裡的items的陣列傳遞近來，然後在template裡去寫我們要呈現出來的HTML。
這裡我們運用v-for將items裡的資訊列出來，然後加入一個子元件，同樣用 v-for 來渲染 items，並將 item 當作 prop 傳入。
最後我們呈現出來的畫面就像這樣，順便把父子元件的位置標出來，看似沒問題但其實這裡有個bug。
當我們去改動input的資料時，我們items裡的資料也會被改動，可是現在我不想動到外層元件的資料要怎麼辦呢?
在前面我們是把整個物件傳遞到子元件，但現在我們是先把物件屬性解構成原始類別(Primitive)後再將資料傳出去，就可以寫下面這樣。
像這樣，將傳入的props解構成純值的作法，更新時就不會改寫到外層的資料了。
今天就先到這了，明天見~
iThome鐵人賽
看影片追技術